<template>
    <div>

        <el-button @click="drawer = true" type="primary" style="margin-left: 0px;" >
            弹出管理台
        </el-button>

        <el-button type="danger" icon="el-icon-warning" @click=turnToLogOut style="float: right;">退出</el-button>


        <el-drawer
                title="管理台"
                :visible.sync="drawer"
                size="45%"
        >
            <el-divider><i class="el-icon-mobile-phone"></i></el-divider>
            <el-row class="sender">
                <el-popconfirm title="访问的是同一个网站，确定吗？" >
                    <el-button @click=turnToAdUser slot="reference" type="primary" round>用户管理</el-button>
                </el-popconfirm>
            </el-row>
            <el-divider><i class="el-icon-mobile-phone"></i></el-divider>
            <el-row class="sender">
                <el-popconfirm title="访问的是同一个网站，确定吗？">
                    <el-button @click=turnToWarticle slot="reference" type="success" round>发布文章</el-button>
                </el-popconfirm>
            </el-row>
            <el-divider><i class="el-icon-mobile-phone"></i></el-divider>
            <el-row class="sender">
                <el-popconfirm title="访问的是同一个网站，确定吗？">
                    <el-button @click=turnToAdarticle slot="reference" type="info" round>管理文章</el-button>
                </el-popconfirm>
            </el-row>
            <el-divider><i class="el-icon-mobile-phone"></i></el-divider>
            <el-row class="sender">
                <el-popconfirm title="访问的是同一个网站，确定吗？">
                    <el-button @click=turnToAdMessage slot="reference" type="warning" round>管理留言板</el-button>
                </el-popconfirm>
            </el-row>
            <el-divider><i class="el-icon-mobile-phone"></i></el-divider>
            <el-row class="sender">
                <el-popconfirm title="访问的是同一个网站，确定吗？">
                    <el-button @click=turnToAdForum slot="reference" type="danger" round>管理论坛</el-button>
                </el-popconfirm>
            </el-row>
            <el-divider><i class="el-icon-mobile-phone"></i></el-divider>
            <el-row class="sender">
                <el-popconfirm title="访问的是同一个网站，确定吗？">
                    <el-button @click=turnToAdIndex slot="reference" round>回到主页</el-button>
                </el-popconfirm>
            </el-row>
            <el-divider><i class="el-icon-mobile-phone"></i></el-divider>
            <div class="sender">
                <el-button @click="innerDrawer = true">打开里面的管理员主页!</el-button>
                <el-drawer
                        title="管理员信息"
                        :append-to-body="true"
                        :visible.sync="innerDrawer">
                    <h1>_(:зゝ∠)_</h1>
                    <el-row>
                        <div>
                            <el-row>
                                <el-divider content-position="left">头像展示</el-divider>
                                <el-col>
                                    <div class="sender">
                                        <img class="fl avator-img" id="js-portrait" v-bind:src= "'http://localhost:8080/img/admin/'+adminName+'.jpg'"
                                             width="150" height="150">
                                    </div>
                                </el-col>
                            </el-row>
                            <el-row>
                                <el-divider content-position="right">管理员姓名</el-divider>
                                <el-col>
                                    <div class="sender">
                                        <h2>管理员 {{adminName}} ，欢迎来到管理端</h2>
                                    </div>
                                </el-col>
                            </el-row>
                        </div>
                    </el-row>
                </el-drawer>
            </div>


        </el-drawer>
    </div>
</template>

<script>
    export default {
        methods:{

            turnToAdUser(){
                this.$router.push('/admin/aduser').catch(error=>error)
            },
            turnToWarticle(){
                this.$router.push('/admin/warticle').catch(error=>error)
            },
            turnToAdarticle(){
                this.$router.push('/admin/adarticle').catch(error=>error)
            },
            turnToAdMessage(){
                this.$router.push('/admin/admessage').catch(error=>error)
            },
            turnToAdForum(){
                this.$router.push('/admin/adForum').catch(error=>error)
            },
            turnToAdIndex(){
                this.$router.push('/admin/adindex').catch(error=>error)
            },
            turnToLogOut(){
                this.$router.push('/admin/adlogin').catch(error=>error)
            }
        },
        data() {
            return {
                drawer: false,
                innerDrawer: false,
                form:[{
                    adminName:'',
                    adminPhoto:''

                }]
            };
        },
        computed:{
            adminName:function() {
                return window.localStorage['adminname'];
            }
        },
        created() {
            this.form.adminName = window.localStorage['adminname'];
            this.request({
                url:'/articleContent/findadmin/'+this.form.adminName
            }).then(res=>{
                this.form.adminPhoto = res.data['adminPhoto'];

            }).catch(err=>{
                console.log(err);
            });
        }
    };
</script>

<style scoped>
    .sender{
        text-align:center;
    }
    .gadmin{
        width: 80%;
        margin-left: 10%;
    }

</style>